<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org" lang="zh">
<head>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<title>首页 - 光年(Light Year Admin)后台管理系统模板</title>
<link rel="icon" href="favicon.ico" type="image/ico">
<meta name="keywords" content="小伟">
<meta name="description" content="小伟">
<meta name="author" content="yinqi">
<link href="../plugin/admin/css/bootstrap.min.css" rel="stylesheet">
<link href="../plugin/admin/css/materialdesignicons.min.css"
	rel="stylesheet">
<link href="../plugin/admin/css/style.min.css" rel="stylesheet">
</head>
<style>
.text-center>tbody>tr>td {
	line-height: 30px;
	font-size: 24px;
	padding-top: 60px;
}
</style>
<body>

	<div class="container">
		<div class="row">
			<div class="col-lg-12 text-center">
				<span style="font-size: 26px;">系统介绍</span>
			</div>
		</div>
		<div class="row">
			<table class="table table-hover text-center align-self-center">
				<tbody>
					<tr>
						<td class="info" width="30%">当前时间</td>
						<td class="active" id="time"></td>
					</tr>
					<tr>
						<td class="info" width="30%">登录ip</td>
						<td class="active" id="ip"></td>
					</tr>
					<tr>
						<td class="info" width="30%">登录地区</td>
						<td class="active" id="city"></td>
					</tr>
					<tr>
						<td class="info" width="30%">系统使用率</td>
						<td class="active" id="useing">
							<div class="progress">
								<div id="cpu" class="progress-bar" role="progressbar"
									aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
									style="width: 60%;">60%</div>
							</div>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>
	<script type="text/javascript" src="../plugin/admin/js/jquery.min.js"
		charset="UTF-8"></script>
	<script type="text/javascript"
		src="../plugin/admin/js/bootstrap.min.js" charset="UTF-8"></script>
	<script type="text/javascript" src="../plugin/admin/js/main.min.js"
		charset="UTF-8"></script>
	<script type="text/javascript" src="../plugin/admin/js/Chart.js"
		charset="UTF-8"></script>
	<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
	<script type="text/javascript">
		$(document).ready(function(e) {

			$("#ip").text(returnCitySN['cip']);
			$("#city").text(returnCitySN["cname"]);
			// $("#cidcode").text(returnCitySN["cid"]);
			// console.log(returnCitySN["cip"]+','+returnCitySN["cname"])
			//console.log(returnCitySN["cid"]);
			/*时间显示*/
			setInterval(function() {
				var now = (new Date()).toLocaleString();
				$('#time').text(now);
			}, 10);
			setInterval(function() {
				var chang = Math.floor(Math.random() * 100);
				$("#cpu").text(chang + "%");
				//$("#cpu").attr("style","width:60%")
			}, 5000);

		});
	</script>
</body>
</html>